@charset "utf-8";
@import "reset";
@function r($px) {
    @return $px/100px*1rem;
}

* {
    margin: 0;
    padding: 0;
    font-size: 0;
}

body {
    .sg_border {
        position: relative;
        padding-top: 47px;
        padding-bottom: 70px;
        header {
            top: 0;
            position: fixed;
            z-index: 2;
            .sg_header {
                width: r(640px);
                background: #b20000;
                padding-top: r(25px);
                padding-bottom: r(25px);
                display: flex;
                align-items: center;
                justify-content: space-between;
                padding-left: r(17px);
                padding-right: r(17px);
                .sg_nav {
                    color: white;
                    width: r(25px);
                    height: r(25px);
                    text-align: center;
                    line-height: r(25px);
                    .icon-daohanglan_moshi {
                        font-size: r(25px);
                        font-weight: bolder;
                    }
                }
                .sg_header_logo {
                    width: r(264px);
                    height: r(39px);
                    //          margin: 0 auto;
                    img {
                        width: 100%;
                        height: 100%;
                    }
                }
                .sg_search {
                    color: white;
                    width: r(43px);
                    height: r(43px);
                    border: 2px solid white;
                    text-align: center;
                    line-height: r(40px);
                    border-radius: 20px;
                    //          border-radius: 30px;
                    .icon-iconfontzhizuobiaozhun023131 {
                        font-size: r(26px);
                    }
                }
            }
        }
        .swiper {
            width: r(640px);
            height: r(357px);
            position: relative;
            img {
                width: 100%;
                height: 100%;
                z-index: 0;
            }
            .sg_img_shadow {
                width: 100%;
                background-color: black;
                z-index: 1;
                opacity: 0.6;
                position: absolute;
                bottom: 0;
                padding: r(25px) r(25px) r(8px) r(30px);
                .sg_shadow_titl {
                    display: flex;
                    padding-bottom: r(8px);
                    h3 {
                        font-size: r(24px);
                        color: #b9a694;
                        font-weight: 300;
                        letter-spacing: 1px;
                    }
                }
                .sg_shadow_hotclick {
                    display: flex;
                    justify-content: space-between;
                    ul {
                        display: flex;
                        justify-content: space-between;
                        &:first-child {
                            li {
                                i {
                                    font-size: r(18px);
                                    color: #f0ece9;
                                    margin-right: r(6px);
                                }
                                span {
                                    color: #f0ece9;
                                    font-size: r(15px);
                                }
                                &:last-child {
                                    margin-left: 10px;
                                }
                            }
                        }
                        &:nth-child(2) {
                            display: flex;
                            justify-content: space-between;
                            //                          align-items: center;
                            i {
                                transform: scale(0.4);
                                color: #cec1b4;
                                &:first-child {
                                    color: red;
                                }
                            }
                        }
                        &:last-child {
                            display: flex;
                            justify-content: space-between;
                            li {
                                span {
                                    font-size: r(12px);
                                    color: #f0ece9;
                                }
                            }
                        }
                    }
                }
            }
        }
        .newsPage {
            background-color: #f5f5f5;
            width: 100%;
            .sg_np_item_one {
                background-color: white;
                ul {
                    display: flex;
                    justify-content: space-between;
                    padding: r(30px) r(30px) r(18px) r(30px);
                    //                  margin-bottom: r(25px);
                    li {
                        h3 {
                            font-size: r(24px);
                            font-weight: 400;
                        }
                        &:first-child {
                            width: r(324px);
                            .item_pagesBox {
                                display: flex;
                                justify-content: space-between;
                                align-items: center;
                                margin-top: r(28px);
                                .item_left {
                                    display: flex;
                                    .sg_icon {
                                        height: r(15px);
                                        line-height: r(36px);
                                        i {
                                            color: #c5c5c5;
                                            font-size: r(28px);
                                        }
                                    }
                                    span {
                                        color: #c5c5c5;
                                        font-size: r(14px);
                                    }
                                }
                                .item_right {
                                    display: flex;
                                    justify-content: space-between;
                                    p {
                                        font-size: r(15px);
                                        color: #c5c5c5;
                                        &:last-child {
                                            margin-left: r(8px);
                                        }
                                    }
                                }
                            }
                        }
                        &:last-child {
                            .item_img {
                                width: r(210px);
                                height: r(122px);
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                }
                hr {
                    text-align: center;
                    width: r(582px);
                    margin: 0 auto;
                }
            }
            .sg_np_item_two {
                background-color: white;
                margin-top: r(25px);
                padding: 0 r(30px) 0 r(30px);
                div {
                    h3 {
                        font-size: r(23px);
                        font-weight: 400;
                        letter-spacing: 1px;
                    }
                    ul {
                        display: flex;
                        justify-content: space-between;
                        margin-bottom: r(20px);
                        li {
                            .sg_np_img {
                                width: r(188px);
                                height: r(123px);
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                    div {
                        display: flex;
                        justify-content: space-between;
                        ul {
                            width: r(300px);
                            li {
                                display: flex;
                                div {
                                    width: r(26px);
                                    height: r(26px);
                                    img {
                                        width: 100%;
                                        height: 100%;
                                    }
                                }
                                span {
                                    transform: scale(0.9);
                                    font-size: r(12px);
                                    color: #c5c5c5;
                                }
                                &:nth-child(2) {
                                    img {
                                        margin-top: r(3px);
                                    }
                                    span {
                                        margin-left: r(5px);
                                        font-size: r(12px);
                                    }
                                }
                                &:nth-child(3) {
                                    img {
                                        margin-top: r(2px);
                                    }
                                    span {
                                        margin-left: r(4px);
                                        font-size: r(12px);
                                    }
                                }
                            }
                            &:last-child {
                                width: r(183px);
                            }
                        }
                    }
                }
            }
            .sg_np_item_four {
                background-color: white;
                padding: 0 r(30px) 0 r(30px);
                div {
                    h3 {
                        font-size: r(23px);
                        font-weight: 400;
                        letter-spacing: 1px;
                    }
                    ul {
                        display: flex;
                        justify-content: space-between;
                        margin-bottom: r(20px);
                        li {
                            .sg_np_img {
                                width: r(188px);
                                height: r(123px);
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                    div {
                        display: flex;
                        justify-content: space-between;
                        ul {
                            width: r(300px);
                            li {
                                display: flex;
                                div {
                                    width: r(26px);
                                    height: r(26px);
                                    img {
                                        width: 100%;
                                        height: 100%;
                                    }
                                }
                                span {
                                    transform: scale(0.9);
                                    font-size: r(12px);
                                    color: #c5c5c5;
                                }
                                &:nth-child(2) {
                                    img {
                                        margin-top: r(3px);
                                    }
                                    span {
                                        margin-left: r(5px);
                                        font-size: r(12px);
                                    }
                                }
                                &:nth-child(3) {
                                    img {
                                        margin-top: r(2px);
                                    }
                                    span {
                                        margin-left: r(4px);
                                        font-size: r(12px);
                                    }
                                }
                            }
                            &:last-child {
                                width: r(183px);
                            }
                        }
                    }
                }
            }
            .sg_np_item_three {
                background-color: white;
                ul {
                    display: flex;
                    justify-content: space-between;
                    padding: r(30px) r(30px) r(18px) r(30px);
                    //                  margin-bottom: r(25px);
                    li {
                        h3 {
                            font-size: r(24px);
                            font-weight: 400;
                        }
                        &:first-child {
                            width: r(324px);
                            .item_pagesBox {
                                display: flex;
                                justify-content: space-between;
                                align-items: center;
                                margin-top: r(28px);
                                .item_left {
                                    display: flex;
                                    .sg_icon {
                                        height: r(15px);
                                        line-height: r(36px);
                                        i {
                                            color: #c5c5c5;
                                            font-size: r(28px);
                                        }
                                    }
                                    span {
                                        color: #c5c5c5;
                                        font-size: r(14px);
                                    }
                                }
                                .item_right {
                                    display: flex;
                                    justify-content: space-between;
                                    p {
                                        font-size: r(15px);
                                        color: #c5c5c5;
                                        &:last-child {
                                            margin-left: r(8px);
                                        }
                                    }
                                }
                            }
                        }
                        &:last-child {
                            .item_img {
                                width: r(210px);
                                height: r(122px);
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                }
                hr {
                    text-align: center;
                    width: r(582px);
                    margin: 0 auto;
                }
            }
            .sg_np_item_five {
                background-color: white;
                ul {
                    display: flex;
                    justify-content: space-between;
                    padding: r(30px) r(30px) r(18px) r(30px);
                    //                  margin-bottom: r(25px);
                    li {
                        h3 {
                            font-size: r(24px);
                            font-weight: 400;
                        }
                        &:first-child {
                            width: r(324px);
                            .item_pagesBox {
                                display: flex;
                                justify-content: space-between;
                                align-items: center;
                                margin-top: r(28px);
                                .item_left {
                                    display: flex;
                                    .sg_icon {
                                        height: r(15px);
                                        line-height: r(36px);
                                        i {
                                            color: #c5c5c5;
                                            font-size: r(28px);
                                        }
                                    }
                                    span {
                                        color: #c5c5c5;
                                        font-size: r(14px);
                                    }
                                }
                                .item_right {
                                    display: flex;
                                    justify-content: space-between;
                                    p {
                                        font-size: r(15px);
                                        color: #c5c5c5;
                                        &:last-child {
                                            margin-left: r(8px);
                                        }
                                    }
                                }
                            }
                        }
                        &:last-child {
                            .item_img {
                                width: r(210px);
                                height: r(122px);
                                img {
                                    width: 100%;
                                    height: 100%;
                                }
                            }
                        }
                    }
                }
                hr {
                    text-align: center;
                    width: r(582px);
                    margin: 0 auto;
                }
            }
            .sg_loading{
                padding: r(20px) 0 r(20px) 0;
                text-align: center;
                background-color: white;
                span{
                    font-size: r(22px);
                }
            }
        }
        footer{
            position: fixed;
            bottom: 0;
            background-color: white;
            width: 100%;
            div{
                padding-top: r(15px);
                padding-bottom: r(12px);
                padding-left: r(14px);
                padding-right: r(14px);
                display: flex;
                justify-content: space-between;
                ul{
                    li{
                        div{
                            width: r(79px);
                            height: r(70px);
                            img{
                                width: 100%;
                                height: 100%;
                            }
                        }
                        p {
                            text-align: center;
                            a {
                                font-size: r(17px);
                                color: #8b8b8b;
                                text-align: center;
                            }
                        }
                    }
                    &:nth-child(3){
                        li{
                            p{
                                color: #b60005;
                            }
                        }
                    }
                }
            }
        }
    }
    .search_web{
       width: 100%;
       height: 100%;
       position: fixed;
       top: 0;
       left: 0;
       transform: translateY(100%); 
       z-index: 3;
    }
    .search_nav{
       width: 100%;
       height: 100%;
       position: fixed;
       top: 0;
       left: 0;
       transform: translateX(100%); 
       z-index: 4;
    }
}